<template>
  <div>
    <div style="margin:0 auto;width: 170px;display: flex; justify-content: space-between;">
      <el-button id="id-business-components-offershare-inSide" icon="el-icon-caret-bottom"
                 :type="(shareType=='inSide')?'primary':''"
                 :disabled="offerInfo == null || !(offerInfo.isShared == 0 || ((offerInfo.originOfferId) && offerInfo.originOfferId != -1))"
                 :autofocus="shareType === 'inSide'" size="mini" style="width: 80px;" @click="shareType ='inSide'">
        内部
      </el-button>
      <el-button id="id-business-components-offershare-outSide" icon="el-icon-caret-top" :type="(shareType=='outSide')?'primary':''" v-if="offerInfo == null || !(offerInfo.originOfferId) || offerInfo.originOfferId == -1" :disabled="offerInfo == null || !(offerInfo.isShared == 1)"
                 :autofocus="shareType === 'outSide'" size="mini" style="width: 80px" @click="shareType='outSide'">
        外部
      </el-button>
      <el-button id="id-business-components-offershare-advSide" icon="el-icon-caret-top" :type="(shareType=='advSide')?'primary':''" v-if="offerInfo != null && (offerInfo.originOfferId) && offerInfo.originOfferId != -1" :disabled="offerInfo == null || !(offerInfo.isShared == 1)"
                 :autofocus="shareType === 'advSide'" size="mini" style="width: 80px" @click="shareType='advSide'">
        外部
      </el-button>
    </div>
    <!--    外部分享-->
    <div v-show="shareType === 'outSide'">
      <offer-share-outside :offer-id="offerId" :open-check="openCheck"></offer-share-outside>
    </div>
    <!--    内部分享-->
    <div v-show="shareType === 'inSide'">
      <offer-share-inside :offer-id="offerId" :open-check="openCheck"></offer-share-inside>
    </div>
    <!--    原广告主分享-->
    <div v-show="shareType === 'advSide'">
      <offer-share-adv :offer-id="offerId" :offer-info="offerInfo" :open-check="openCheck" :confirm-to-share="confirmToShare"></offer-share-adv>
    </div>
  </div>
</template>
<script>
import offerShareOutside from "./offerShareOutside";
import offerShareInside from "./offerShareInside"
import offerShareAdv from "./offerShareAdv";

export default {
  name: 'offerShare',
  props: {
    confirmToShare: {
      type: Number
    },
    offerId: {
      type: String
    },
    offerInfo: {
      type: Object
    },
    openCheck: {
      type: Boolean,
      require:true
    },
  },
  watch: {
    offerInfo: {
      deep: true,
      handler(val, old) {
        if (val == null || val === old) {
          return
        }
        let self = this;
        if(val.isShared == 0) {
          setTimeout(()=>{
            self.shareType = 'inSide';
          },20);
        } else if(!(val.originOfferId) || val.originOfferId == -1) {
          if(self.shareType != 'outSide') {
            setTimeout(()=>{
              self.shareType = 'outSide';
            },20);
          }
        } else {
          if(self.shareType == 'outSide') {
            setTimeout(()=>{
              self.shareType = 'advSide';
            },20);
          }
        }
      }
    },
  },
  components: {
     offerShareInside,  offerShareOutside, offerShareAdv
  },
  data() {
    return {
      agentList:[{
        url:'www.baidu.com',
        company:'北海九剑',
        platform:'ios,android',
        iosCountry:'美国,日本',
        androidCountry:'越南,老挝',
        status:'1',
        permission:'1'
      }],//代理商列表
      outAccountList:[],//外部账户列表
      shareType: '',//分享类型

    }
  },
  created() {
    this.shareType = 'inSide'
  },
}
</script>
<style lang="scss">

</style>
